<template>
	<div>
		<div style="width:400px">
			<el-form :model="formData" :rules="rules" label-width="80px">
				<el-row :gutter="30">
					<el-col>
						<el-form-item label="菜单名称" prop="title">
							<el-input v-model="formData.title"></el-input>
						</el-form-item>
					</el-col>
					<el-col>
						<el-form-item label="图标名称" prop="icon">
							<el-input v-model="formData.icon"></el-input>
						</el-form-item>
					</el-col>
					<el-col>
						<el-form-item label="启用状态" prop="enable">
							<el-radio-group v-model="formData.enable">
								<el-radio  :label="1">启用</el-radio>
								<el-radio  :label="0">禁用</el-radio>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col>
						<el-form-item label="菜单标识" prop="key">
							<el-input v-model="formData.key" placeholder="菜单标识"></el-input>
						</el-form-item>
					</el-col>
					<el-col>
						<el-form-item label="菜单路径" prop="path">
							<el-input v-model="formData.path" placeholder="菜单路径"></el-input>
						</el-form-item>
					</el-col>
					
					<el-col>
						<el-form-item label="排序" prop="order">
							<el-input v-model="formData.order" placeholder="排序"></el-input>
						</el-form-item>
					</el-col>
 
					<el-col>
						<el-button type="primary" @click="handleSave">保存</el-button>
					</el-col>
				</el-row>
			</el-form>
		</div>
	</div>
</template>

<script>
	import http from '@/utils/http';
	export default{
		data(){
			return{
				menuid:-1,
				formData:{
					enable:1
				},
				rules:{
					title:[{required:true,message:"请输入菜单名称",trigger:'blur'}],
					key:[{required:true,message:"请输入菜单标识",trigger:'blur'}]
				},
			}
		},
		mounted() {
			const params = new URLSearchParams(window.location.search);
			this.menuid = params.get("menuid");
			console.log(this.menuid);
			this.loadMenuDetail();
		},
		methods:{
			loadMenuDetail() {
				const params = {
					menuid: this.menuid
				}
				http.post("/api/admin/menus/detail", params).then(res => {
					if (res.status == 200 && res.data.code) {
						this.formData= res.data.detail;
						this.formData.enable=this.formData.enable=='1'?1:0;
					}
				}).catch(error => {})
			},
			handleSave(){
				const params={
					menuid:this.formData.mid,
					title:this.formData.title,
					icon:this.formData.icon,
					key:this.formData.key,
					path:this.formData.path,
					enable:this.formData.enable? 1:0,
					order:this.formData.order
				}
				
				http.post("/api/admin/menus/update", params).then(res => {
					if (res.status == 200 && res.data.code) {
						this.$message.success({message:res.data.msg,duration:1500,showClose:true,onClose() {
							window.parent.postMessage("closedrawer");
						}});
						
					}
				}).catch(error => {})
				
			}
		}
	}
</script>

<style>
</style>